{% extends "configurarProyectoLayout.html" %}
{% block subbody %}

<script>
	function paginar(pagina){
		window.location.href="agregarUsuarioProyecto?pagina="+pagina+"&idproyecto="
				+ document.form.idproyecto.value+"&filtro="+document.form.filtro.value;
	}
	function add() {
		window.location.href = "agregarUsuarioProyecto?idproyecto="
			+ document.form.idproyecto.value+"&filtro="+document.form.filtro.value;
	}
	function edit() {
		var valor;
		if (document.form.check.value != null && document.form.check.checked) {
			valor = document.form.check.value;
		} else {
			for (i = 0; i < document.form.check.length; i++) {
				if (document.form.check[i].checked) {
					valor = document.form.check[i].value;
				}
			}
		}
		if (valor != null) {
			window.location.href = "agregarRolUsuario?idproyecto="
				+ document.form.idproyecto.value+"&idusuario="
					+ valor;
		} else {
			alert('Seleccionar un usuario');
		}
	}
</script>
<body>
	<center>
		<div class="titulorojo">AGREGAR USUARIOS DEL SISTEMA AL PROYECTO</div>
	</center>
	<center>
		<form name="form" method="POST" action="agregarUsuarioProyecto">
			<table>	<input type="hidden" name="idproyecto" value="{{ idproyecto }}">
				<tr>
					<td class=titulochico>Filtro:</td>
					<td><input name=filtro size=20 maxlength=40
						value="{{ filtro }}"></td>
					<td><button onclick="submit">
							<img src="{{ url_for('static', filename='searching2.png') }}">
						</button></td>
					<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
					<td><button type="button" onClick="edit()">
							<img src="{{ url_for('static', filename='add.png') }}">
						</button></td>
				</tr>
			</table>
			<br>
			<div>
			<a {% if cantPaginas !=1  %} href="javascript:paginar({{ primera }})" {% endif %} style="text-decoration:none">[primera</a>/
			<a {% if ant >= 1 %} href="javascript:paginar({{ ant }})" {% endif %} style="text-decoration:none">anterior]</a>
			...
			{% if pagina - 2 >= primera %}
			<a href="javascript:paginar({{ pagina-2 }})" style="text-decoration:none">{{ pagina-2 }}</a>
			{% endif %}
			{% if pagina - 1 >= primera %}
			<a href="javascript:paginar({{ pagina-1 }})" style="text-decoration:none">{{ pagina-1 }}</a>
			{% endif %}
			{{ pagina }}
			{% if pagina + 1 <= ultima %}
			<a href="javascript:paginar({{ pagina+1 }})" style="text-decoration:none">{{ pagina+1 }}</a>
			{% endif %}
			{% if pagina + 2 <= ultima %}
			<a href="javascript:paginar({{ pagina+2 }})" style="text-decoration:none">{{ pagina+2 }}</a>
			{% endif %}
			...
			<a {% if sig <= cantPaginas %} href="javascript:paginar({{ sig }})" {% endif %} style="text-decoration:none">[siguiente</a>/
			<a {% if cantPaginas !=1  %} href="javascript:paginar({{ ultima }})" {% endif %} style="text-decoration:none">ultima]</a>
			
			</div>
			<table id="tabla" name="tabla" border=1 cellpadding=2 cellspacing=1
				width=100% align=center bgcolor=#E5E5E5>
				<tr>
					<th class=titulochico width='30%'>Nombre</th>
					<th class=titulochico width='30%'>Apellido</th>
					<th class=titulochico width='30%'>Usuario</th>
					<th class=titulochico width='10%'>Marcar</th>
				</tr>
				{% for usuario in lista : %}
				</tr>
				<td align=center>{{ usuario.nombre }}</td>
				<td align=center>{{ usuario.apellido }}</td>
				<td align=center>{{ usuario.usuario }}</td>
				<td align=center><input type="radio" name="check"
					value="{{ usuario.idusuario }}"></td>
				</tr>
				{% endfor %}
			</table>
			<script type="text/javascript">
				$().ready(function() {
					$("#tabla").tableSorter({
						sortClassAsc : 'headerSortUp',
						sortClassDesc : 'headerSortDown',
						headerClass : 'header',
						disableHeader : 'ID'
					}).tableEditor({
						COL_APPLYCLASS : true,
						EDIT_HTML : 'edit',
						SAVE_HTML : 'save',
						EVENT_LINK_SELECTOR : 'button.eventLink',
						FUNC_POST_EDIT : 'postEdit'
					});

					document.counter = 1;
				});
			</script>
		</form>
	</center>
</body>
{% endblock %}
